<template>
  <div id="basic-data">
    <el-tabs v-model="activeName" tab-position="left" type="card" style="background-color: #ffffff; height: calc(100vh - 80px);" @tab-click="handleClick">
      <el-tab-pane label="产权取得方式" name="getType">
        <One />
      </el-tab-pane>
      <el-tab-pane label="经营状况" name="bussinessStatus">
        <bussinessStatus v-if="activeShow==='bussinessStatus'" />
      </el-tab-pane>
      <el-tab-pane label="招商局公司状态" name="componeyState">
        <componeyState v-if="activeShow==='componeyState'" />
      </el-tab-pane>
      <el-tab-pane label="设立目的/存续理由" name="bulidReason">
        <bulidReason v-if="activeShow==='bulidReason'" />
      </el-tab-pane>
      <el-tab-pane label="产权登记情形" name="prsituation">
        <prsituation v-if="activeShow==='prsituation'" />
      </el-tab-pane>
      <el-tab-pane label="注册类型" name="registerType">
        <registerType v-if="activeShow==='registerType'" />
      </el-tab-pane>
      <el-tab-pane label="他方注册类型" name="otherRegisterType">
        <otherRegisterType v-if="activeShow==='otherRegisterType'" />
      </el-tab-pane>
      <el-tab-pane label="产权退出方式" name="outType">
        <outType v-if="activeShow==='outType'" />
      </el-tab-pane>
      <el-tab-pane label="会计核算类型" name="accountType">
        <accountType v-if="activeShow==='accountType'" />
      </el-tab-pane>
      <el-tab-pane label="国有出资情形" name="stateOwned">
        <stateOwned v-if="activeShow==='stateOwned'" />
      </el-tab-pane>
      <el-tab-pane label="资本来源类型" name="fromType">
        <fromType v-if="activeShow==='fromType'" />
      </el-tab-pane>
      <el-tab-pane label="国民经济行业分类" name="nationalEconomy">
        <nationalEconomy v-if="activeShow==='nationalEconomy'" />
      </el-tab-pane>
      <el-tab-pane label="招商局行业分类" name="cmbusiness">
        <cmbusiness v-if="activeShow==='cmbusiness'" />
      </el-tab-pane>
      <el-tab-pane label="治理结构类型" name="management">
        <management v-if="activeShow==='management'" />
      </el-tab-pane>
      <el-tab-pane label="产生方式" name="production">
        <production v-if="activeShow==='production'" />
      </el-tab-pane>
      <el-tab-pane label="上市交易所及模块" name="listed">
        <listed v-if="activeShow==='listed'" />
      </el-tab-pane>
      <el-tab-pane label="财务指标来源" name="indexFrom">
        <indexFrom v-if="activeShow==='indexFrom'" />
      </el-tab-pane>
      <el-tab-pane label="填报途径" name="fillType">
        <fillType v-if="activeShow==='fillType'" />
      </el-tab-pane>
      <el-tab-pane label="主办单位" name="organzer">
        <organzer v-if="activeShow==='organzer'" />
      </el-tab-pane>
      <el-tab-pane label="档案类型" name="docType">
        <docType v-if="activeShow==='docType'" />
      </el-tab-pane>
      <el-tab-pane label="文件类型" name="fileType">
        <fileType v-if="activeShow==='fileType'" />
      </el-tab-pane>
      <el-tab-pane label="证券账户类别" name="securityType">
        <securityType v-if="activeShow==='securityType'" />
      </el-tab-pane>
      <el-tab-pane label="合伙人类别" name="partnerType">
        <partnerType v-if="activeShow==='partnerType'" />
      </el-tab-pane>
      <el-tab-pane label="出资方式" name="outMoneyType">
        <outMoneyType v-if="activeShow==='outMoneyType'" />
      </el-tab-pane>
      <el-tab-pane label="交易类型" name="transactionType">
        <transactionType v-if="activeShow==='transactionType'" />
      </el-tab-pane>
      <el-tab-pane label="股份分类" name="shareSort">
        <shareSort v-if="activeShow==='shareSort'" />
      </el-tab-pane>
      <el-tab-pane label="合伙人类型" name="partnerLeixing">
        <partnerLeixing v-if="activeShow==='partnerLeixing'" />
      </el-tab-pane>
      <el-tab-pane label="国家" name="country">
        <country v-if="activeShow==='country'" />
      </el-tab-pane>
      <el-tab-pane label="地区-省份" name="province">
        <province v-if="activeShow==='province'" />
      </el-tab-pane>
      <el-tab-pane label="地区-城市" name="city">
        <city v-if="activeShow==='city'" />
      </el-tab-pane>
      <el-tab-pane label="地区-区/县" name="area">
        <area1 v-if="activeShow==='area'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import One from './components/one'
import RegisterType from './components/registerType'
import bussinessStatus from './components/bussinessStatus'
import bulidReason from './components/buildReason'
import prsituation from './components/prsituation'
import outType from './components/outType'
import accountType from './components/accountType'
import stateOwned from './components/stateOwned'
import fromType from './components/fromType'
import cmbusiness from './components/cmbusiness'
import management from './components/management'
import production from './components/production'
import listed from './components/listed'
import indexFrom from './components/indexFrom'
import fillType from './components/fillType'
import organzer from './components/organzer'
import docType from './components/docType'
import fileType from './components/fileType'
import securityType from './components/securityType'
import partnerType from './components/partnerType'
import outMoneyType from './components/outMoneyType'
import otherRegisterType from './components/otherRegisterType'
import transactionType from './components/transactionType'
import shareSort from './components/shareSort'
import partnerLeixing from './components/partnerLeixing'
import componeyState from './components/componeyState'
import province from './position/province.vue'
import city from './position/city.vue'
import area1 from './position/area.vue'
import country from './position/country.vue'
import nationalEconomy from './components/nationalEconomy.vue'
export default {
  components: {
    One,
    RegisterType,
    bussinessStatus,
    bulidReason,
    prsituation,
    outType,
    accountType,
    stateOwned,
    fromType,
    cmbusiness,
    management,
    production,
    listed,
    indexFrom,
    fillType,
    organzer,
    docType,
    fileType,
    securityType,
    partnerType,
    outMoneyType,
    otherRegisterType,
    transactionType,
    shareSort,
    partnerLeixing,
    componeyState,
    province,
    city,
    area1,
    country,
    nationalEconomy

  },
  data() {
    return {
      activeName: 'getType',
      activeShow: ''
    }
  },
  methods: {
    handleClick(label) {
      switch (label.name) {
        case 'getType':
          this.activeShow = 'getType'
          break
        case 'registerType':
          this.activeShow = 'registerType'
          break
        case 'componeyState':
          this.activeShow = 'componeyState'
          break
        case 'bulidReason':
          this.activeShow = 'bulidReason'
          break
        case 'bussinessStatus':
          this.activeShow = 'bussinessStatus'
          break
        case 'prsituation':
          this.activeShow = 'prsituation'
          break
        case 'outType':
          this.activeShow = 'outType'
          break
        case 'accountType':
          this.activeShow = 'accountType'
          break
        case 'stateOwned':
          this.activeShow = 'stateOwned'
          break
        case 'fromType':
          this.activeShow = 'fromType'
          break
        case 'nationalEconomy':
          this.activeShow = 'nationalEconomy'
          break
        case 'cmbusiness':
          this.activeShow = 'cmbusiness'
          break
        case 'management':
          this.activeShow = 'management'
          break
        case 'production':
          this.activeShow = 'production'
          break
        case 'listed':
          this.activeShow = 'listed'
          break
        case 'indexFrom':
          this.activeShow = 'indexFrom'
          break
        case 'fillType':
          this.activeShow = 'fillType'
          break
        case 'organzer':
          this.activeShow = 'organzer'
          break
        case 'docType':
          this.activeShow = 'docType'
          break
        case 'fileType':
          this.activeShow = 'fileType'
          break
        case 'securityType':
          this.activeShow = 'securityType'
          break
        case 'partnerType':
          this.activeShow = 'partnerType'
          break
        case 'outMoneyType':
          this.activeShow = 'outMoneyType'
          break
        case 'otherRegisterType':
          this.activeShow = 'otherRegisterType'
          break
        case 'transactionType':
          this.activeShow = 'transactionType'
          break
        case 'shareSort':
          this.activeShow = 'shareSort'
          break
        case 'partnerLeixing':
          this.activeShow = 'partnerLeixing'
          break
        case 'province':
          this.activeShow = 'province'
          break
        case 'city':
          this.activeShow = 'city'
          break
        case 'area':
          this.activeShow = 'area'
          break
        case 'country':
          this.activeShow = 'country'
          break
      }
    }
  }
}
</script>

<style lang="less">
  .el-tabs__nav-scroll {
    overflow: auto;
  }
  .el-tabs__nav-next, .el-tabs__nav-prev {
    display: none;
  }
  #basic-data {
    ::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    /*定义滚动条轨道 内阴影+圆角*/
    ::-webkit-scrollbar-track {
      border-radius: 10px;
    }
    /*定义滑块 内阴影+圆角*/
    ::-webkit-scrollbar-thumb {
      border-radius: 10px;
      box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
      background-color: rgba(0,0,0,0.1);
    }
  }
</style>
